{% extends "base.html" %} {% block title %}注册 - 运动健康管理系统{% endblock %}
{% block content %}
<div class="row justify-content-center my-5">
  <div class="col-md-8 col-lg-6">
    <div class="card shadow">
      <div class="card-body p-5">
        <h2 class="text-center mb-4">
          <i class="bi bi-person-plus"></i> 用户注册
        </h2>

        <!-- 显示闪现消息 -->
        {% with messages = get_flashed_messages(with_categories=true) %} {% if
        messages %} {% for category, message in messages %}
        <div
          class="alert alert-{{ category if category != 'message' else 'info' }} alert-dismissible fade show"
          role="alert">
          {{ message }}
          <button
            type="button"
            class="btn-close"
            data-bs-dismiss="alert"
            aria-label="Close"></button>
        </div>
        {% endfor %} {% endif %} {% endwith %}

        <form
          id="registerForm"
          method="POST"
          action="{{ url_for('register') }}">
          {{ form.hidden_tag() }}
          <div class="mb-3">
            <label for="username" class="form-label">用户名</label>
            {{ form.username(class="form-control" + (" is-invalid" if
            form.username.errors else ""), id="username") }} {% if
            form.username.errors %}
            <div class="invalid-feedback">
              {% for error in form.username.errors %} {{ error }} {% endfor %}
            </div>
            {% endif %}
            <div class="form-text">用户名最多20个字符</div>
          </div>

          <div class="mb-3">
            <label for="email" class="form-label">电子邮箱</label>
            {{ form.email(class="form-control" + (" is-invalid" if
            form.email.errors else ""), id="email") }} {% if form.email.errors
            %}
            <div class="invalid-feedback">
              {% for error in form.email.errors %} {{ error }} {% endfor %}
            </div>
            {% endif %}
            <div class="form-text">
              请输入有效的电子邮箱地址，如 example@domain.com
            </div>
          </div>

          <div class="mb-3">
            <label for="phone" class="form-label">手机号码</label>
            {{ form.phone(class="form-control" + (" is-invalid" if
            form.phone.errors else ""), id="phone") }} {% if form.phone.errors
            %}
            <div class="invalid-feedback">
              {% for error in form.phone.errors %} {{ error }} {% endfor %}
            </div>
            {% endif %}
            <div class="form-text">请输入11位手机号码</div>
          </div>

          <div class="mb-3">
            <label for="password" class="form-label">密码</label>
            {{ form.password(class="form-control" + (" is-invalid" if
            form.password.errors else ""), id="password") }} {% if
            form.password.errors %}
            <div class="invalid-feedback">
              {% for error in form.password.errors %} {{ error }} {% endfor %}
            </div>
            {% endif %}
            <div class="form-text">密码长度至少6位</div>
          </div>

          <div class="mb-3">
            {{ form.confirm_password.label(class="form-label") }} {{
            form.confirm_password(class="form-control") }} {% for error in
            form.confirm_password.errors %}
            <div class="text-danger">{{ error }}</div>
            {% endfor %}
          </div>

          <div class="mb-3">
            {{ form.admin_key.label(class="form-label") }} {{
            form.admin_key(class="form-control",
            placeholder="如果您有管理员密钥，请在此输入") }}
            <div class="form-text">如果您没有管理员密钥，请留空此字段</div>
          </div>

          <div class="mb-3">
            {{ form.submit(class="btn btn-primary w-100") }}
          </div>

          <div class="text-center mt-3">
            <p>已有账号？<a href="{{ url_for('login') }}">登录</a></p>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
{% endblock %} {% block extra_js %}
<script src="{{ url_for('static', filename='scripts/register.js') }}"></script>
{% endblock %}
